<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isErrorPage="true" isELIgnored="false"%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta http-equiv="Content-Language" content="UTF-8" />
    <%@include file="../../common/commonCss.jsp"%>
    <%@include file="../../common/commonJs.jsp"%>

    <link rel="stylesheet" href="${ctx}/resources/common/zTree_v3/css/metroStyle/metroStyle.css" type="text/css">
    <script type="text/javascript" src="${ctx}/resources/common/zTree_v3/js/jquery.ztree.all.js"></script>
    <script src="js/roleManage.js"></script>

    <style>
        body{
            padding: 10px;
        }
        .bg-purple-dark {
            border-left:5px solid #99a9bf;
            background-color:#eeeeee;
            border-top-left-radius: 4px;
            border-bottom-left-radius: 4px;
            -moz-border-radius-topright: 4px;
            -moz-border-radius-bottomleft: 4px;
            -webkit-border-top-left-radius: 4px;
            -webkit-border-bottom-left-radius:  4px;
        }
        .grid-content {
            padding: 10px 0 10px 10px;
            height: 55px;
        }

    </style>
</head>

<body>
<div id="app">
    <div class="grid-content bg-purple-dark">
        <button-group size="large">
            <i-button type="primary" @click="addButt">
                <icon type="plus-round"></icon>
                新增
            </i-button>
            <i-button type="primary" @click="deleteBatch">
                批量删除
                <icon type="trash-a"></icon>
            </i-button>
        </button-group>
    </div>
    <i-table border ref="selection" :columns="columns" :data="tableData" :height="427" :stripe="true" @on-selection-change="handleRowChange"></i-table>
    <div style="position: absolute; bottom: 10px; text-align: center; width: 98%;">
        <page :total="total" size="small" show-elevator show-sizer show-total placement="top" @on-page-size-change="onPageSizeChange" @on-change="pageNext"></page>
    </div>
</div>
<script type="text/javascript">
    var vueGridApp;
    roleManage.fun.initGrid();
//    $("#addButt").click(function () {
//        //返回所选的行，当没有选择任何行的时候返回一个空数组。
//        // console.log($('#tableGrid').bootstrapTable('getSelections'));
//        baseJS.baseLayerOpen("/backstage/roleManage/addRole","新增角色",2,340,200);
//    })
</script>

</body>

</html>